$(function(){
    $("header").load("./header.html",function(){
        $.getScript('./js/header.js');
    })
    $(".inner-left").hover(function(){
        $(this).children("a").css("color","#fa4b9b");
    },function(){
        $(this).children("a").css("color","#666");
    });
    $(".inner-right").find("li").hover(function(){
        $(this).children("a").css("color","#fa4b9b");
    },function(){
        $(this).children("a").css("color","#666");
    });
    $(".search button").hover(function(){
        $(this).css("backgroundColor","#f94282");
    },function(){
        $(this).css("backgroundColor","#fa4b9b");
    });
    $(".cart").on("mouseenter",function(){
        $(".cart-more").show();
        $(this).find("span").show();
        $(this).find("i").css({
            color:"#fa4b9b",
            background:"#fff",
            border:"1px solid #fa4b9b",
            borderBottom:"none",
            borderRight:"none",
            height:"38px",
        })
        $(this).children("a").css({
            border:"1px solid #fa4b9b",
            borderBottom : "none",
            background:"#fff",
            height :"38px",

        })
    })
    $(".cart").on("mouseleave",function(){
        $(".cart-more").hide();
        $(this).find("span").hide();
        $(this).find("i").css({
            color:"",
            background:"",
            border:"",
            borderBottom:"",
            borderRight:"",
            height:"",
        })
        $(this).children("a").css({
            border:"",
            borderBottom : "",
            background:"",
            height :"",

        })
    })
    var oItems=document.querySelectorAll('.items');
    var oNav_down=document.querySelector('.nav-down');
    for(var i=0;i<oItems.length;i++){
        oItems[i].index=i;
        oItems[i].onmouseenter=function(){
            for(var j=1;j<oItems.length;j++){
                oItems[j].style.backgroundColor="#fa4b9b";
            }
            oItems[this.index].style.backgroundColor="#ec0971";
        }
        oItems[i].onmouseleave=function(){
            oItems[this.index].style.backgroundColor="";
        }
    }
    $(".items").eq(3).on("mouseenter",function(){
        $(this).find("i").css("transform","rotate(-180deg)");
        $(".nav-down").css("display","block");
        $(".nav-down li").css("background","");
    });
    $(".items").eq(3).on("mouseleave",function(){
        $(this).find("i").css("transform","rotate(0deg)");
        $(".nav-down").css("display","none");
    });

    $(".nav-down").on("mouseenter",function(){
        $(".nav-down").css("display","block");
    })
    $(".nav-down").on("mouseleave",function(){
        $(".nav-down").css("display","none");
    })
    $(".nav-down li").on("mouseenter",function(){
        $(this).css({
            background:"#fa4b9b",
            color:"#fff"
        }).siblings("li").css({
            background:"",
            color:""
        });
    })
    var oDl=document.querySelectorAll('.menu-detail>dl');
    var oChildren=document.querySelectorAll('.menu-children');
    var oI=document.querySelectorAll('.icon-circle-right');
    for(var i=0;i<oDl.length;i++){
        oDl[i].index=i;
        oDl[i].onmouseenter=function(){
            for(var j=0;j<oDl.length;j++){
                oChildren[j].style.display="none";
                oDl[j].style.borderLeft="";
                oDl[j].style.background="";
                oI[j].style.display="";
            }
            oChildren[this.index].style.display="block";
            oDl[this.index].style.borderLeft="3px solid #fb60a7";
            oI[this.index].style.display="none";
            oDl[this.index].style.background="#fff";
        }
        oDl[i].onmouseleave=function(){
            this.style.borderLeft="";
            oChildren[this.index].style.display="none";
            oI[this.index].style.display="";
            oDl[this.index].style.background="";
        }
    }
    $(".menu-detail a").hover(function(){
        $(this).css("color","#fb60a7");
    },function(){
        $(this).css("color","");
    });
    //轮播图
   var oUl=document.querySelector('.banner ul');
   var oUlli=document.querySelectorAll('.banner>ul >li');
   var oSpan=document.querySelectorAll('.circle span');
    var timer=setInterval(autoPaly,2000);
   var autoIndex=0;
   var circleIndex=0;
   function autoPaly(){
       autoIndex++;
       if(autoIndex>1){
           autoIndex=0;
       }
       circleIndex++;
       if(circleIndex>1){
           circleIndex=0;
       }
       for(var i=0;i<oUlli.length;i++){
           animate(oUlli[i],{opacity:0});
           oSpan[i].className="";
       }
       animate(oUlli[autoIndex],{opacity:1});
       oSpan[circleIndex].className="current";
   }
    oUl.onmouseenter=function(){
       clearInterval(timer);
   }
    oUl.onmouseleave=function(){
       timer=setInterval(autoPaly,2000);
   }

   //圆点轮播
    for(var i=0;i<oSpan.length;i++){
       oSpan[i].index=i;
       oSpan[i].onclick=function(){
           autoIndex=circleIndex=this.index-1;
           autoPaly();
       }
       if(i==0){
           oSpan[i].className="current";
       }
    }

    $(".btn").hover(function(){
        $(this).css("background","#ff0000");
    },function(){
        $(this).css("background","");
    });
   $(".each_pro a").hover(function(){
       $(this).find("img").css("opacity",".9");
   },function(){
       $(this).find("img").css("opacity","1");
   });
    $(".help_l dl dd a").hover(function(){
        $(this).css("color","#fa4b9b");
    },function(){
        $(this).css("color","");
    });
    
    $(".help_r a").eq(1).hover(function(){
        $(".wx_code").css("display","block")
    },function(){
        $(".wx_code").css("display","")
    });

    $(".footer_link").eq(0).find("a").hover(function(){
        $(this).css("color","#fa4b9b");
    },function(){
        $(this).css("color","");
    });

    $(window).scroll(function(){
        let $scroll=$(this).scrollTop();
        if($scroll>$("header").height()){
            $(".rightbar").css("display","block");
            $(".advertise").css("display","block");
            $(".leftbar").css("display","block");
        }else{
            $(".rightbar").css("display","");
            $(".advertise").css("display","");
            $(".leftbar").css("display","");
        }
    })
    $(".rightbar li a").eq(1).on("click",function(){
        alert("请登录后再来点我哦")
        location="login.html";
        return false;
    })

    $(".rightbar li").hover(function(){
        $(this).css("background","#fafafa");
    },function(){
        $(this).css("background","");
    });
    $(".top").on("click",function(){
        $('html , body').animate({scrollTop: 0},400);
    })


    var userInfo=null;
    var jsonStr=sessionStorage.getItem("login");
    userInfo=JSON.parse(jsonStr||'{}');

    if(userInfo.uname!=undefined){
        $("#login").text(userInfo.uname);
    }
    //数据动态渲染
    $.ajax({
        url:"./../server/goodsInfo.php",
        dataType:"json",
    }).done(function(res){
        res.forEach((el,index)=>{
            const strHtml=`
            <a href="#"><img src="${el.gImg}" alt="">
                <div class="rec_message">
                    <h4>${el.gName}</h4>
                    <em>${el.gDes}</em>
                    <p class="price">
                        <span class="new">秒杀价:¥
                            <b>${el.gNewPrice}</b>
                            </span> <span class="old">市场价:¥<s>${el.gOldPrice}</s></span>
                    </p>
                    <span class="btn">马上抢</span> <span class="buy">${el.gBuy}人已买</span>
                </div>
            </a>
            `;
            $(".rec_detail").append(strHtml);
        })
    })

    $(".rec_detail").on("click",function(){
        $(this).find("a").first().addClass("tiaozhuan").on("click",function(){
            window.location.href="goods.html";
        });

        return false;
    })


});